<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="../css/public.css" media="all">
</head>

<body>
    <div class="layuimini-container">
        <div class="layui-tab">
            <ul class="layui-tab-title">
                <li class="layui-this">我的磅单</li>
                <li>异常磅单</li>
            </ul>
            <div class="layuimini-main">
                <fieldset class="table-search-fieldset">
                    <legend>搜索信息</legend>
                    <div style="margin: 10px 10px 10px 10px">
                        <form class="layui-form layui-form-pane" action="">
                            <div class="layui-form-item">
                                <div class="layui-inline">
                                    <label class="layui-form-label">磅单编号</label>
                                    <div class="layui-input-inline" style="width: 225px;">
                                        <input type="text" name="plid" id="plid" autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label">要货工地</label>
                                    <div class="layui-input-block" style="width: 225px;">
                                        <select name="workplace" id='pname' lay-search>
                                            <option value="">请选择工地</option>
                                            <option value="0">旭辉运河悦章</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="layui-inline" style="margin-left:10px">
                                    <label class="layui-form-label">货物名称</label>
                                    <div class="layui-input-inline" style="width: 225px;">
                                        <input type="text" name="mname" id="mname" autocomplete="off"
                                            class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label">创建时间</label>
                                    <div class="layui-input-inline" style="width: 225px;">
                                        <input type="text" name="begin" id="begin" autocomplete="off"
                                            class="layui-input" placeholder="请选择时间范围起始">
                                    </div>
                                    <div class="layui-input-inline" style="width: 5px;">
                                        <span>-</span>
                                    </div>
                                    <div class="layui-input-inline" style="width: 225px;">
                                        <input type="text" name="end" id="end" autocomplete="off" class="layui-input"
                                            placeholder="请选择时间范围结束">
                                    </div>
                                </div>
                                <div class="layui-inline" style="margin-left: 110px;">
                                    <button type="submit" class="layui-btn layui-btn-primary" lay-submit
                                        lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </fieldset>
            </div>

            <div class="layui-tab-content" style="padding: 10px;">
                <div class="layui-tab-item layui-show">
                    <script type="text/html" id="toolbarDemo">
                        <div class="layui-btn-container">
                            <button class="layui-btn layui-btn-normal  layui-btn-sm" lay-event="show"> 磅单详情
                            </button>
                        </div>
                    </script>
                    <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
                </div>
                <div class="layui-tab-item">
                    <script type="text/html" id="toolbarDemo2">
                        <div class="layui-btn-container">
                            <button class="layui-btn layui-btn-normal  layui-btn-sm" lay-event="detail"> 查看明细
                            </button>
                            <button class="layui-btn layui-btn-normal  layui-btn-sm" lay-event="show"> 磅单详情
                            </button>
                        </div>
                    </script>
                    <table class="layui-hide" id="currentTableId2" lay-filter="currentTableFilter"></table>
                </div>
            </div>
        </div>

        <script src="../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
        <script type="text/html" id="Tpl">
            <div>
                {{#  if(d.additionN !='0'){ }}
                <span>冷冻剂*{{d.additionN}}</span>
                {{#  }}}
            </div>
        </script>
        <script>
            layui.use(['form', 'table'], function () {
                var $ = layui.jquery,
                    form = layui.form,
                    table = layui.table;
                table.render({
                    elem: '#currentTableId',
                    url: '/pl',
                    method: 'get',
                    parseData: function (res) { //res 即为原始返回的数据
                        return {
                            "code": res.code, //解析接口状态
                            "count": res.count, //解析表格数据总条数 eg:共100页              
                            "data": res.data //解析table表格数据源
                        };
                    },
                    where: {
                        "mode": '1',
                        "usual": '1',
                        "search": '0',
                    }, //where用来传递请求时额外的参数 eg:productName
                    cols: [
                        [{
                                field: 'pname',
                                width: 150,
                                title: '要货工地',
                                align: "center",
                                sort: true
                            }, {
                                field: 'plid',
                                width: 200,
                                title: '磅单编号',
                                align: "center",
                                sort: true
                            },

                            {
                                field: 'mname',
                                width: 100,
                                title: '货物名称',
                                align: "center"
                            },
                            {
                                field: 'car',
                                title: '车牌号',
                                width: 100,
                                align: "center"
                            }, {
                                field: 'drivername',
                                title: '司机信息',
                                width: 200,
                                align: "center",
                                templet: '<div>{{d.drivername}} {{d.driverphone}}</div>'
                            }, {
                                field: 'weight',
                                title: '净重（吨）',
                                width: 120,
                                align: "center",
                                sort: true
                            }, {
                                field: 'status',
                                title: '状态',
                                width: 100,
                                align: "center",
                                sort: true
                            }, {
                                field: 'additionN',
                                title: '附属商品',
                                width: 150,
                                align: "center",
                                sort: true,
                                templet: '#Tpl'
                            },
                            {
                                title: '操作',
                                minWidth: 150,
                                toolbar: '#toolbarDemo',
                                align: "center"
                            }
                        ]
                    ],
                    skin: 'line'
                });
                table.render({
                    elem: '#currentTableId2',
                    url: '/pl',
                    method: 'get',
                    parseData: function (res) { //res 即为原始返回的数据
                        return {
                            "code": res.code, //解析接口状态
                            "count": res.count, //解析表格数据总条数 eg:共100页              
                            "data": res.data //解析table表格数据源
                        };
                    },
                    where: {
                        "mode": '1',
                        "usual": '0',
                        "search": '0',
                    }, //where用来传递请求时额外的参数 eg:productName
                    cols: [
                        [{
                                field: 'pname',
                                width: 150,
                                title: '要货工地',
                                align: "center",
                                sort: true
                            }, {
                                field: 'plid',
                                width: 200,
                                title: '磅单编号',
                                align: "center",
                                sort: true
                            },

                            {
                                field: 'mname',
                                width: 150,
                                title: '货物名称',
                                align: "center"
                            },
                            {
                                field: 'car',
                                title: '车牌号',
                                width: 150,
                                align: "center"
                            },
                            {
                                field: 'weight',
                                title: '净重（吨）',
                                width: 150,
                                align: "center",
                                sort: true
                            }, {
                                field: 'mile',
                                title: '调度里程（km）',
                                width: 150,
                                align: "center",
                                sort: true
                            },
                            {
                                title: '操作',
                                minWidth: 90,
                                toolbar: '#toolbarDemo2',
                                align: "center"
                            }
                        ]
                    ],
                    skin: 'line'
                });
                table.on('tool(currentTableFilter)', function (obj) {
                    if (obj.event === 'show') {
                        var mid = obj.data.mid;
                        var options = {
                            href: 'poundListDetail.html?mid=' + mid,
                            title: '磅单详情'
                        };
                        parent.layui.miniTab.openNewTabByIframe(options);
                    } else if (obj.event === 'detail') {
                        var options = {
                            href: 'poundListDetail2.html?mid=' + mid,
                            title: '查看明细'
                        };
                        parent.layui.miniTab.openNewTabByIframe(options);
                    }
                });

                form.on('submit(data-search-btn)', function (data) {
                    var result = JSON.stringify(data.field);
                    layer.alert(result, {
                        title: '最终的搜索信息'
                    });

                    //执行搜索重载
                    table.reload('currentTableId', {
                        url: '/pl',
                        method: 'get',
                        parseData: function (res) { //res 即为原始返回的数据
                            return {
                                "code": res.code, //解析接口状态
                                "count": res.count, //解析表格数据总条数 eg:共100页              
                                "data": res.data //解析table表格数据源
                            };
                        },
                        where: {
                            "mode": '1',
                            "search": '1',
                            "usual": '1',
                            "plid": $('#plid').val(),
                            "mname": $('#mname').val()
                        }
                    }, 'data');
                    table.reload('currentTableId2', {
                        url: '/pl',
                        method: 'get',
                        parseData: function (res) { //res 即为原始返回的数据
                            return {
                                "code": res.code, //解析接口状态
                                "count": res.count, //解析表格数据总条数 eg:共100页              
                                "data": res.data //解析table表格数据源
                            };
                        },
                        where: {
                            "mode": '1',
                            "search": '1',
                            "usual": '0',
                            "plid": $('#plid').val(),
                            "mname": $('#mname').val()
                        }
                    }, 'data');
                    return false;
                });

            });
        </script>

</body>

</html>